<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="/template.xhtml">
        <ui:define name="title">
            <div class="tituloPagina">
                <h:graphicImage value="/LaCruz_v2/faces/javax.faces.resource/img/report-icon.png" />
                <h:outputText value="#{bundle.EditProdutoTitle}" style="padding-left: 10px" ></h:outputText>
            </div>
        </ui:define>

        <ui:define name="body">

            <h:panelGroup id="messagePanel" layout="block">
                <h:messages errorStyle="color: red" infoStyle="color: green" layout="table"/>
            </h:panelGroup>
            <h:form id="formEditProduto" prependId="false">
                <h:outputScript name="js/jquery.maskMoney.js" target="head" rendered="true" />
                <h:outputScript name="js/jquery-validate/jquery.validate.js" target="head" rendered="true" />

                <h:inputHidden id="caminhoImagem" value="#{produtoController.selected.caminhoImagem}" />
                <br />
                <h:commandLink action="#{produtoController.prepareCreate}"  >
                    <h:graphicImage title="voltar" value="/LaCruz_v2/faces/javax.faces.resource/img/go-back-icon.png" />
                </h:commandLink>
                <br />
                <h:panelGrid columns="2">
                    <h:outputLabel value="#{bundle.CreateProdutoLabel_colecao}" for="colecao" />
                    <h:selectOneMenu id="colecao" value="#{produtoController.selected.colecao}" style="width: 150px" title="#{bundle.CreateProdutoTitle_colecao}" required="true" requiredMessage="#{bundle.CreateProdutoRequiredMessage_colecao}">
                        <f:selectItems value="#{colecaoController.itemsAvailableSelectOne}"/>
                    </h:selectOneMenu>
                    <h:outputLabel value="#{bundle.CreateProdutoLabel_descricao}" for="descricao" />
                    <h:inputText id="descricao" value="#{produtoController.selected.descricao}" style="width: 150px" maxlength="50" title="#{bundle.CreateProdutoTitle_descricao}" />
                    <h:outputLabel value="#{bundle.CreateProdutoLabel_valorUnitario}" for="valorUnitario"  />
                    <h:inputText id="valorUnitario" value="#{produtoController.selected.valorUnitario}" style="width: 150px" maxlength="20" title="#{bundle.CreateProdutoTitle_valorUnitario}" required="true" requiredMessage="#{bundle.CreateProdutoRequiredMessage_valorUnitario}">
                        <f:convertNumber type="currency" pattern="###.00" locale="pt_BR" groupingUsed="true" />
                    </h:inputText>
                    <h:outputLabel value="#{bundle.CreateProdutoLabel_quantidade}" for="quantidade" />
                    <h:inputText id="quantidade" value="#{produtoController.selected.quantidade}" style="width: 150px" maxlength="4"  title="#{bundle.CreateProdutoTitle_quantidade}" required="true" requiredMessage="#{bundle.CreateProdutoRequiredMessage_quantidade}"/>
                    <h:outputLabel value="#{bundle.CreateProdutoLabel_caminhoImagem}" for="caminhoImagem" />
                    <input onmouseout="if($('#caminhoImagemFake').val() != ''){$('#caminhoImagem').val($('#caminhoImagemFake').val())};" type="file"  name="caminhoImagemFake" id="caminhoImagemFake" accept="image/png,image/jpeg,image/jpg,image/gif" />


                    <h:outputLabel value="#{bundle.CreateProdutoLabel_tamanho}" for="tamanho"  />
                    <h:selectOneMenu id="tamanho" value="#{produtoController.selected.tamanho}" style="width: 150px" title="#{bundle.CreateProdutoTitle_tamanho}" required="true" requiredMessage="#{bundle.CreateProdutoRequiredMessage_tamanho}">
                        <f:selectItems value="#{tamanhoController.itemsAvailableSelectOne}"/>
                    </h:selectOneMenu>
                    <h:outputLabel value="#{bundle.CreateProdutoLabel_modelo}" for="modelo"/>
                    <h:selectOneMenu id="modelo" value="#{produtoController.selected.modelo}" style="width: 150px" title="#{bundle.CreateProdutoTitle_modelo}" required="true" requiredMessage="#{bundle.CreateProdutoRequiredMessage_modelo}">
                        <f:selectItems value="#{modeloController.itemsAvailableSelectOne}"/>
                    </h:selectOneMenu>
                    <h:outputLabel value="#{bundle.CreateProdutoLabel_cor}" for="cor" />
                    <h:selectOneMenu id="cor" value="#{produtoController.selected.cor}" style="width: 150px" title="#{bundle.CreateProdutoTitle_cor}" required="true" requiredMessage="#{bundle.CreateProdutoRequiredMessage_cor}">
                        <f:selectItems value="#{corController.itemsAvailableSelectOne}"/>
                    </h:selectOneMenu>

                    <h:outputLabel value="#{bundle.CreateProdutoLabel_informacaoAdicional}" for="informacaoAdicional" >

                    </h:outputLabel>
                    <h:inputTextarea rows="5" cols="5" id="informacaoAdicional" value="#{produtoController.selected.informacaoAdicional}" style="width: 150px" title="#{bundle.CreateProdutoTitle_informacaoAdicional}" required="true" requiredMessage="#{bundle.CreateProdutoRequiredMessage_informacaoAdicional}">
                    </h:inputTextarea >


                </h:panelGrid>
                <div class="buttonStyle">
                    <h:commandLink action="#{produtoController.update}" value="#{bundle.EditProdutoSaveLink}"/>
                </div>

                <br />
                <br />
            </h:form>
            <script type="text/javascript" >
        $("input[name='valorUnitario']").maskMoney({symbol: "R$ ", decimal: ",", thousands: ".",showSymbol:true});
            </script>
            <script type="text/javascript">
      //Validaçao de formulário
      $(document).ready(function(){
          //id do form
          jQuery('#formEditProduto').validate( {
              rules: {
                  valorUnitario: {
                      number: true
                  },
                  quantidade: {
                      number: true
                  }
              },
              //mensagens, caso não bater com as regras
              messages: {
                  valorUnitario: {
                      number:"valor deve ser num&eacute;rico"
                  },
                  quantidade: {
                      number:"valor deve ser num&eacute;rico"
                  }
               }
          });
      });

            </script>
        </ui:define>
    </ui:composition>

</html>
